<script setup>
import { friendHeadShot, friendName, friendId, type, friendGender, friendBirthday, friendPhone, masterId } from '@/stores/friend'
import { friendAndGroupInfoDrawer } from '@/stores/page'
import friendInfoCard from '../card/friendInfoCard.vue'
import groupInfoCard from '../card/groupInfoCard.vue'
import { isAddGroup, isFriend, judgeIsAddGroup, judgeIsFriend } from '@/stores/page';

</script>

<template>
<div>
<el-drawer v-model="friendAndGroupInfoDrawer" :with-header="false">
        <div class="demo-image__preview">
    <el-image
      style="width: 100px; height: 100px;"
      :src="friendHeadShot"
      :zoom-rate="1.2"
      :max-scale="7"
      :min-scale="0.2"
      :preview-src-list="[friendHeadShot]"
      fit="cover"
    />
  </div>

  <div v-if="type === 'user'">
    <friendInfoCard :friendId="friendId" :friendName="friendName" :friendGender="friendGender" :friendBirthday="friendBirthday"
    :friendPhone="friendPhone"></friendInfoCard>
   </div>
   <div v-else>
    <groupInfoCard :groupId="friendId" :groupName="friendName" :groupMasterId="masterId"></groupInfoCard>
   </div>

  </el-drawer>
</div>
    
</template>

<style scoped>

</style>